<template>
  <!-- 分享配置 -->
  <div>
    <el-form ref="form5" :model="form5" label-width="150px" :rules="rules">
      <el-row>
        <el-col :span="24">
          <el-form-item prop="share_img_ids" label="上传分享海报">
            <newUpload ref="uploadImg3" :fileNum="12" :file-list="fileList3" :size-number="2"></newUpload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item prop="mini_img_ids" label="小程序卡片图">
            <newUpload ref="uploadImg4" :fileNum="1" :file-list="fileList4" :size-number="2"></newUpload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="小程序卡片文案" prop="mini_word">
            <el-input v-model="form5.mini_word" clearable />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item prop="web_img_ids" label="H5朋友圈小图">
            <newUpload ref="uploadImg5" :fileNum="1" :file-list="fileList5" :size-number="2"></newUpload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="H5朋友圈文案" prop="web_word">
            <el-input v-model="form5.web_word" clearable />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item prop="web_bg_img_ids" label="H5背景图">
            <newUpload ref="uploadImg6" :fileNum="1" :file-list="fileList6" :size-number="2"></newUpload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item>
            <el-button type="primary" @click="handleSubmit" :disabled="disabled">提交</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
import { handleShare } from "@/api/invitationMange";
import newUpload from "@/components/imgUpload/shopImgUp";
export default {
  components: { newUpload },
  props: ["title", "activeId", "obj"],
  data() {
    return {
      form5: {
        share_img_ids: [],
        mini_img_ids: [],
        web_img_ids: [],
        web_bg_img_ids: [],
        mini_word: "",
        web_word: ""
      },
      share: "",
      disabled: false,
      fileList3: [],
      fileList4: [],
      fileList5: [],
      fileList6: [],
      rules: {
        share_img_ids: [
          {
            required: true,
            message: "请选择上传分享海报"
          }
        ],
        mini_img_ids: [
          {
            required: true,
            message: "请选择小程序卡片图"
          }
        ],
        web_img_ids: [
          {
            required: true,
            message: "请选择H5朋友圈小图"
          }
        ],
        web_bg_img_ids: [
          {
            required: true,
            message: "请选择H5背景图"
          }
        ],
        mini_word: [
          {
            required: true,
            message: "请填写小程序卡片文案",
            trigger: "blur"
          }
        ],
        web_word: [
          {
            required: true,
            message: "请填写H5朋友圈文案",
            trigger: "blur"
          }
        ]
      }
    };
  },
  watch: {
    obj(val) {
      if (val == "c" && this.title == "five") {
        this.disabled = true;
      }
    }
  },
  mounted() {},

  methods: {
    //提交
    handleSubmit() {
      this.form5.share_img_ids = this.$refs.uploadImg3.submitUpload();
      this.form5.mini_img_ids = this.$refs.uploadImg4.submitUpload()[0];
      this.form5.web_img_ids = this.$refs.uploadImg5.submitUpload()[0];
      this.form5.web_bg_img_ids = this.$refs.uploadImg6.submitUpload()[0];
      let data = {
        share_img_ids: JSON.stringify(this.form5.share_img_ids),
        mini_img_ids: JSON.stringify([this.form5.mini_img_ids]),
        web_img_ids: JSON.stringify([this.form5.web_img_ids]),
        web_bg_img_ids: JSON.stringify([this.form5.web_bg_img_ids]),
        mini_word: this.form5.mini_word,
        web_word: this.form5.web_word,
        id: this.activeId
      };
      if (this.activeId) {
        handleShare(data).then(res => {
          if (res.data.code == 200) {
            this.$message({
              message: "提交成功",
              type: "success"
            });
            this.share = res.data.data.number;
            this.$emit("prize", this.title, this.activeId, this.share);
          }
        });
      } else {
        this.$emit("prize", this.title, this.activeId);
      }
    }
  }
};
</script>
<style  scoped>
</style>